/**
 *   <div id="app">hello {{ msg }}<h></h></div>
 * 
 *  render() { _c 解析标签
 *     return _c('div', {id: app}, _v('hello' + _s(msg)), _c)
 *  }
 */

const defaultTagRE = /\{\{((?:.|\r?\n)+?)\}\}/g; // {{}}

// 处理属性
function genProps(attrs) {
    let str = ''
    // 对象
    for(let i = 0; i < attrs.length; i++) {
        let attr = attrs[i]
        if(attr.name === 'style') {
            let obj = {}
            attr.value.split(';').forEach(item => {
                let [key, val] = item.split(':') 
                obj[key] = val
            })
            attr.value = obj
        }
        // 拼接
        str += `${attr.name}:${JSON.stringify(attr.value)},`
    }
    return `{${str.slice(0, -1)}}`
}

// 处理子节点
function genChildren(el) {
    let children = el.children
    if(children) {
        return children.map(child => gen(child)).join(',')
    }
}
function gen(node) { // 1，元素 3，文本
    if(node.type === 1) {
        return generate(node)
    } else { // 文本  (1) 只是文本 （2）{{}}
        let text = node.text
        if(!defaultTagRE.test(text)) {
            return `_v(${JSON.stringify(text)})`
        }
        // 带有 {{}}
        let tokens = []
        let lastindex = defaultTagRE.lastIndex = 0
        let match
        while(match = defaultTagRE.exec(text)) {
            let index = match.index
            
            if(index > lastindex) { // 添加内容
                tokens.push(JSON.stringify(text.slice(lastindex, index)))    
            }
            // {{}}
            tokens.push(`_s(${match[1].trim()})`)
            lastindex = index + match[0].length
        }
        if(lastindex < text.length){
            tokens.push(JSON.stringify(text.slice(lastindex)))
        }
        return `_v(${tokens.join('+')})`
    }
}
export function generate(el) {
    let children = genChildren(el)
    let code = `_c('${el.tag}', ${el.attrs.length ? `${genProps(el.attrs)}` : 'undefined'}, ${children ? `${children}` : 'null'})`

    return code
}